<template>
  <!-- 早班会记录列表 -->
  <base-breadcrumb>
    <searchData :searchData="searchConfig" @search="search" />
    <div class="page-body">
      <a-card :bordered="false">
        <!-- <title-name title="班前一会一操" /> -->
        <div class="table-operateors mb20">
          <div class="pub-table-select-count" style="margin:10px 0">
            <a-icon type="info-circle" theme="twoTone" />
            <span>
              班组数为:
              <a>{{ totalCount.teamNum || 0 }}</a>，
            </span>
            <span>
              今日已填报早班会:
              <a>{{ totalCount.hasWriteToday || 0 }}</a>，
            </span>
            <span>
              还未提交:
              <a>{{ totalCount.hasNoWriteToday || 0 }}</a>，
            </span>
            <a @click="handleToDetail">查看填报详情</a>
          </div>
        </div>
        <list-table
          ref="table"
          size="default"
          rowKey="id"
          :columns="columns"
          :request="loadData"
          :alert="true"
          show-size-changer
          show-quick-jumper
          showPagination="auto"
        >
          <template slot="status" slot-scope="text, record">
            <list-status :status="record.status" conversion="en" :text="text"></list-status>
          </template>
          <template slot="operator" slot-scope="text, record">
            <div class="pub-table-list-action">
              <span v-if="record.status === 'BUILD'" style="color: grey;">查看</span>
              <span v-else class="base-btn" @click="handleUpdate('look', record)">查看</span>
              <span @click="del(record.id)" v-if="hideBuquBtn()">删除</span>
            </div>
          </template>
        </list-table>
      </a-card>
    </div>
  </base-breadcrumb>
</template>

<script>
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import BSearchData from '@/components/BComponents/BSearchData'
import SelectProject from '@/components/Select/SelectProject' // 项目
import OrgTreeSelect from '@/components/OrgTreeSelect'
import StatusDisplay from '@/components/StatusDisplay'
import {
  del,
  deleteMeetingRecord,
  getMeetingRecordList,
  getMorningShiftCount
} from '@/api/safetySupervision/morningMeeting.js'
import { STable } from '@/components'
import moment from 'moment'

export default {
  name: 'a' + Date.now(),
  components: {
    STable,
    StatusDisplay,
    BSearchData
  },
  data() {
    return {
      statisticsInfo: {
        teamNum: 0, // 班组数
        morningShiftNum: 0, // 早班数
        unCommit: 0 // 未提交数
      },
      totalCount: {
        teamNum: 0, // 班组数
        hasWriteToday: 0, // 早班数
        hasNoWriteToday: 0 // 未提交数
      },
      searchOptions: [
        // { name: '所属分公司', valueKey: 'branchComId', type: SelectSubCompany },
        {
          name: '所属单位',
          valueKey: 'searchQuery',
          type: OrgTreeSelect,
        },
        // { name: '所属项目', keyValue: 'branchComId', valueKey: 'projectId', type: SelectProject },
        { name: '班组', value: 'teamName', type: 'input' },
        { name: '班组长', value: 'teamLeader', type: 'input' },
        {
          name: '填报时间',
          value: 'applyTime',
          type: 'dateRange',
          attr: {
            rangeFormat: ['beginTime', 'endTime'],
            allowClear: false
          },
          setInitValue: true,
          initValue: [moment(), moment()]
        },
        {
          name: '状态',
          value: 'status',
          type: 'select',
          data: [
            {
              label: '未提交',
              value: 'DRAFT'
            },
            {
              label: '已提交',
              value: 'SUBMITTED'
            }
          ]
        }
      ],
      searchForm: {
        applyTime: [moment(), moment()]
      },
      searchConfig: [
      {
          name: '所属单位',
          valueKey: 'searchQuery',
          type: OrgTreeSelect,
        },
        // {
        //   type: SelectSubCompany, value: 'branchComId', label: '分公司', attrs: {
        //     allowClear: true,
        //     autoSelected: false
        //   }
        // },
        // {
        //   type: SelectProject,
        //   value: 'projectId',
        //   label: '项目',
        //   attrs: {
        //     keyValue: 'branchComId',
        //     allowClear: true,
        //     autoSelected: false,
        //     isMaintenance:true
        //   }
        // },
        { type: 'input', value: 'teamName', name: '班组' },
        { type: 'input', value: 'teamLeader', name: '班组长' },
        {
          type: 'dateRange', value: 'applyTime', name: '填报时间',
          // attrs: {
          //   rangeFormat: ['beginTime', 'endTime'],
          //   allowClear: true
          // }
        },
        {
          type: 'select', value: 'status', name: '状态',
          data: [
            {
              label: '未提交',
              value: 'DRAFT'
            },
            {
              label: '已提交',
              value: 'SUBMITTED'
            },
            {
              label: '无施工',
              value: 'BUILD'
            }
          ]
          // attrs: {
          //   key: ['label', 'value'],
            
          // }
        }
      ],
      columns: [
        { title: '班组', dataIndex: 'teamName', width: 200 },
        { title: '班组长', dataIndex: 'teamLeader', width: 120 },
        { title: '分包公司', dataIndex: 'subcontractorName', width: 200 },
        { title: '所属分公司', dataIndex: 'branchComName', width: 200 },
        { title: '所属项目', dataIndex: 'projectName' },
        { title: '填报时间', dataIndex: 'morningTime', width: 150 },
        { title: '状态', dataIndex: 'status', width: 150, scopedSlots: { customRender: 'status' } },
        { title: ' 操作', dataIndex: 'operator', width: 150, scopedSlots: { customRender: 'operator' } }
      ],
      queryParam: {},
      init: true,
      loadData: async (p) => {
        const q = Object.assign({}, p, this.queryParam)
        if (q.beginTime) {
          // q.beginTime = q.beginTime + ' 00:00:00'
          // q.endTime = q.endTime + ' 23:59:59'
        } else {
          if (this.init) {
            q.beginTime = moment().format('YYYY-MM-DD')
            q.endTime = moment().format('YYYY-MM-DD')
            // q.beginTime = moment().format('YYYY-MM-DD') + ' 00:00:00'
            // q.endTime = moment().format('YYYY-MM-DD') + ' 23:59:59'
          }
        }
        this.getRecordStatistics(q)
        const [err, res] = await getMeetingRecordList(q)
        return new Promise((resolve, reject) => {
          if (err) {
            reject(err)
          } else {
            this.init = false
            resolve(res)
          }
        })
      },
      resetCb: form => form['applyTime'] = []
    }
  },
  created() {
  },
  methods: {
    search(val) {
      const { applyTime, ...others } = val
      this.queryParam = applyTime ? {
        ...others,
        beginTime: moment(applyTime[0]).format('YYYY-MM-DD'),
        endTime: moment(applyTime[1]).format('YYYY-MM-DD')
      } : val
      this.$refs.table.refresh(true)
    },
    del(id) {
      this.$delList3(del, () => {
        this.$refs.table.refresh(true)
      }, { id })
    },
    // 获取统计信息
    async getRecordStatistics(params) {
      const [err, res] = await getMorningShiftCount(params)
      if (!err) {
        // this.statisticsInfo = res.data
        this.totalCount = res.data
      }
    },
    handleToDetail() {
      this.$router.push({
        name: 'MeetingStatistics'
      })
    },
    // 处理更新操作（新增、编辑）
    handleUpdate(type, data = {}) {
      const pathName = type === 'look' ? 'LookMeetingRecord' : 'UpdateMeetingRecord'
      this.$router.push({
        name: pathName,
        query: {
          pageType: type,
          id: data.id || ''
        }
      })
    },
    handleGetThemes(data) {
      console.log(data)
      console.log('zzz', this.formInfo.getFieldsValue())
    }
  }
}
</script>

<style lang="less" scoped>
.page-header {
  .header-row {
    display: flex;

    .flex-content {
      flex: auto;
    }

    .divider {
      margin: 0 12px;
    }

    .expand-btn {
      margin-left: 8px;
      font-size: 14px;
    }
  }
}

.page-body {
  .table-operateors {
    .ant-btn + .ant-btn {
      margin-left: 12px;
    }
  }
}
</style>